<template>
	<view class="content-list ss-flex-col">
		<view class="top-head ss-flex-row ss-row-between ss-col-center">
			<!-- <view class="date">2025-05-25周三</view> -->
			<view class="income">收入 ￥{{total}}</view>
		</view>
		<view class="content-cell ss-flex-row ss-row-between" v-for="(item,index) in data" :key="index">
			<view class="left ss-flex-row ss-row-left ss-col-center">
				<image :src="sheep.$url.cdn('/static/income/money.png')"
					style="width: 63.02rpx;height: 63.02rpx;align-self: flex-end;margin-right: 23.61rpx;"></image>
				<view class="title-time ss-flex-col ss-row-between">
					<view class='title'>{{item.memo}}</view>
					<view class="time ss-m-t-4">{{handlerTime(item.create_time)}}</view>
				</view>
			</view>
			<view class="right">￥{{item.amount}}</view>
		</view>
	</view>
</template>

<script setup>
	import sheep from '@/sheep';
	import dayjs from 'dayjs';
	const props = defineProps({
		data: {
			type: Array,
			default: [],
		},
		total:{
			type:Number,
			default:0,
		}
	})
	function handlerTime(date){
		return dayjs(date*1000).format('YYYY-MM-DD HH:mm:ss');
	}
</script>

<style lang="scss" scoped>
	
	.content-list {
		width: calc(100% - 22rpx - 18rpx - 19rpx - 20rpx);
		margin-top: 37rpx;
		margin-left: 22rpx;
		margin-right: 18rpx;
		padding: 10rpx 20rpx 29.5rpx 19rpx;
		
		border-radius: 20rpx;
		background: #FFFFFF;
		box-shadow: 0rpx 4rpx 10rpx 0rpx rgba(0, 0, 0, 0.3);

		.top-head {
			.date {

				height: 41rpx;
				font-family: Source Han Sans;
				font-size: 28rpx;
				font-weight: normal;
				line-height: normal;
				letter-spacing: normal;
				color: #1E1E1E;
			}

			.income {

				height: 41rpx;
				font-family: Source Han Sans;
				font-size: 28rpx;
				font-weight: normal;
				line-height: normal;
				text-align: right;
				letter-spacing: normal;
				color: #B0B0B0;


			}
		}

		.content-cell {
			height: 91rpx;
			margin-top: 10rpx;
			padding-bottom: 16rpx;
			border-bottom: 1rpx solid #ACACAC;

			.title {
				width:360rpx;
				overflow: hidden;
				text-overflow: ellipsis;
				white-space: nowrap;
				height: 46rpx;
				font-family: Source Han Sans;
				font-size: 32rpx;
				font-weight: normal;
				line-height: normal;
				letter-spacing: normal;
				color: #1E1E1E;
			}

			.time {
				height: 41rpx;
				font-family: Source Han Sans;
				font-size: 28rpx;
				font-weight: normal;
				line-height: normal;
				letter-spacing: normal;
				color: #A9A9A9;
			}

			.right {
				width:200rpx;
				
				overflow: hidden;
				text-overflow: ellipsis;
				white-space: nowrap;
				
				margin-bottom: 2rpx;
				height: 52rpx;
				font-family: Source Han Sans;
				font-size: 30rpx;
				font-weight: 500;
				line-height: normal;
				text-align: right;
				letter-spacing: normal;
				color: #1E1E1E;
				align-self: flex-end;

			}
		}
	}
</style>